<template>
    <div class="pageFooter">
        <div class="remark-box" v-if="pageFooter.oneRemark">
            <p class="remark">{{pageFooter.oneRemark}}</p>
        </div>
        <div class="remark-box" v-if="pageFooter.repeatRemark">
            <p class="remark" v-for="item in pageFooter.repeatRemark">{{item}}</p>
        </div>
        <div class="footer-text">
            {{ pageFooter.footerText ||'STRICTLY PRIVATE AND CONFIDENTIAL'}}
        </div>
        <div class="footer-page">{{pageFooter.footerPage}}</div>
    </div>
</template>

<script>
  export default {
    name: 'pageFooter',
    props:['pageFooter'],
    data() {
      return {}
    },
    created() {
    },
    mounted() {
    },
    methods: {},
    components: {}
  }
</script>

<style lang="scss">
    .pageFooter {
        position: absolute;
        left: 20px;
        right: 20px;
        bottom: 25px;
        .footer-text {
            color: #3B6EB6;
            float: left;
            font-size: 12px;
        }
        .footer-page{
            color: #3B6EB6;
            float: right;
            font-size: 12px;
        }
        .remark-box {
            margin-bottom:15px;
            padding: 0 15px;
            .remark {
                color: #666;
                font-size: 12px;
                line-height: 2;
            }
        }
    }
</style>
